import React, { lazy, Suspense } from 'react';
import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom';
import { Spin } from '@nbase/ui';
import AuthRoute from '~/components/AuthRoute';
import BasicLayout from '~/layouts/BasicLayout';

// 懒加载页面组件
const Login = lazy(() => import('~/pages/Login'));

/**
 * 加载组件
 */
export const Loading: React.FC = () => (
  <div style={{ textAlign: 'center', padding: '50px' }}>
    <Spin size="large" />
  </div>
);

/**
 * 路由配置组件
 */
export const AppRouter: React.FC = () => {
  return (
    <BrowserRouter>
      <Routes>
        {/* 登录页 */}
        <Route
          path="/login"
          element={
            <Suspense fallback={<Loading />}>
              <Login />
            </Suspense>
          }
        />

        {/* 主应用路由（需要认证） */}
        <Route
          path="/*"
          element={
            <AuthRoute>
              <BasicLayout />
            </AuthRoute>
          }
        />

        {/* 默认重定向 */}
        <Route path="*" element={<Navigate to="/" replace />} />
      </Routes>
    </BrowserRouter>
  );
};

